/* Block de connexion/inscription sur mobile */

#register_mobile{
    display: none;
    height: 180px;
}

#mobile_customer{
    background-image: url('../Images/Inscription/customer_icon.png');
    background-position: right bottom;
    background-size: 90px 90px;
    background-repeat: no-repeat;
    background-color: #8bd9e7;
}

#mobile_prod{
    background-color: #f62c2c;
}

#register_mobile a{
    display: block;
    color: white;
    text-decoration: none;
    font-weight: bold;
    height: 45%;
    margin: 5px 10px 5px 10px;
    border-radius: 10px;
}

/* Fin de block de connexion/inscription sur mobile */

.bodyInscription {
 margin:50px 0px; padding:0px;
}

.bodyInscription a{
 text-decoration: none;
 display: inline-block;
 width: 40%;
 margin: 0px 10px 0px 10px;
}

.col{
 width: 100%; 
 margin:0px auto;  
 padding:15px;
 text-align:center;
}

.champ {
text-align: left;
height: 40px;
margin: 5px;
border:1px solid #9FC6FF;
padding:5px;
border-radius: 10px;
width: 80%;
}

.champ::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #9FC6FF;
}
 
.champ input:-moz-placeholder {
    color: #9FC6FF;
}

input.formChampInvalid::-webkit-input-placeholder {
   color: red;
}

input.formChampInvalid::-moz-placeholder {
   color: red;
}

.informationErreurConnexion{
   color: red;
}

.champ:focus{
 border: 1px solid #9FC6FF;
 padding:5px;
 box-shadow:2px 2px 20px #b1cef6; 
-moz-box-shadow:2px 2px 20px #b1cef6;
-webkit-box-shadow:2px 2px 20px #b1cef6;
  outline:  none;
}

.labelLeft{
	margin-right: 65%;
	color: #0C1EFA;
}

.champSecond {
border:1px solid #1f2dec;
}

.champSecond::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #0C1EFA;
}
 
.champSecond input:-moz-placeholder {
    color: #0C1EFA;
}

.champSecond:focus{
 border: 1px solid #1f2dec;
 padding:5px;
 box-shadow:2px 2px 20px #414ef9; 
-moz-box-shadow:2px 2px 20px #414ef9;
-webkit-box-shadow:2px 2px 20px #414ef9;
  outline:  none;
}


.EButton {
	-moz-box-shadow:inset 0px 1px 10px 2px #cae3fc;
	-webkit-box-shadow:inset 0px 1px 10px 2px #cae3fc;
	box-shadow:inset 0px 1px 10px 2px #cae3fc;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #4197ee) );
	background:-moz-linear-gradient( center top, #79bbff 5%, #4197ee 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#4197ee');
	background-color:#79bbff;
	-webkit-border-top-left-radius:10px;
	-moz-border-radius-topleft:10px;
	border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	-moz-border-radius-topright:10px;
	border-top-right-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	-moz-border-radius-bottomright:10px;
	border-bottom-right-radius:10px;
	-webkit-border-bottom-left-radius:10px;
	-moz-border-radius-bottomleft:10px;
	border-bottom-left-radius:10px;
	text-indent:0px;
	border:1px solid #469df5;
	display: inline-block;
	color:#ffffff;
	font-family:Arial;
	font-size:18px;
	font-weight:bold;
	font-style:normal;
	height:32px;
	line-height:32px;
	width:30%;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #287ace;
}
.EButton:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #4197ee), color-stop(1, #79bbff) );
	background:-moz-linear-gradient( center top, #4197ee 5%, #79bbff 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4197ee', endColorstr='#79bbff');
	background-color:#4197ee;
}
.EButton:active {
	position:relative;
	top:1px;
}
.EButton:focus {
  outline:  none;
}

.tooltipError{
	color: red;
}

.arrondieImg {
-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;
width: 100%;
}

.radio{
    display: inline-block;
    height: 40px;
    padding: 0;
    margin: 5px 0px 5px 0px;
    border-radius: 5px;
}

.radio:hover{
    background-color: rgba(92, 92, 92, 0.20);
    box-shadow: inset 1px 1px 10px #444;
}

.radio > label{
    display: inline-block;
    height: 100%;
    padding: 5px;
}

/***** MEDIA QUERY *****/
@media only screen and (max-width:1050) {
 .champ {
	width:75%;
 }
 .EButton{
	width:75%;
 }
}

@media only screen and (max-width:640) {
 .arrondieImg{
	width: 450px;
 }
  .EButton{
	width:45%;
 }
}

/* Style pour les ecrans jusqu'à 1500px de largeur*/
@media all and (max-width: 480px)
{
    #register_desktop{
        display: none;
    }

    #register_mobile{
       display: inline-block;
       position: relative;
       vertical-align: top;
       width: 68%;
    }

    #observation{
        display: inline-block;
        vertical-align: top;
    }

    .col{
        padding: 0;
        margin: 0;
    }

    .bodyInscription.col{
        display: inline-block;
        width: 65%;
        vertical-align: top;
    }

    .EButton {
        width: 50%;
    }
	
	#idPayerPanier{
		margin-left: 12%;
	}
}


